import React from "react";
import { useDispatch, useSelector } from "react-redux";
import { asyncAddTodo, title } from "../../../app/slice/addtodoSlice";
import './TodoHeader.css';
export default function TodoHeader() {
  let dispatch=useDispatch()
  let addtodo=useSelector(state=>state.addtodo)
  return (
    <div className="todo-header">
      <input type="text" placeholder="请输入你的任务名称，按回车键确认" value={addtodo} onChange={(e)=>{
        dispatch(title(e.target.value))
      }} onKeyUp={(e)=>{
        if (e.code==='Enter') {
          // console.log(addtodo);
          dispatch(asyncAddTodo(addtodo))
        }
      }} />
    </div>
  );
}
